﻿@model Refactored.Models.LoginModel

@functions{
    public string GetAntiForgeryToken()
    {
        string cookieToken, formToken;
        AntiForgery.GetTokens(null, out cookieToken, out formToken);
        return cookieToken + ":" + formToken;
    }
}

<header>
    <h1 data-bind="text: chosenView" />
</header>

<div id="main-content">
    @if (@User.Identity.IsAuthenticated)
    {
        <p class="error" data-bind="text: error"></p>
        <input id="antiForgeryToken" type="hidden" value="@GetAntiForgeryToken()" />

        <section id="books" data-bind="foreach: books">
            <article class="todoList">
                <header>
                    <h3 data-bind="value: title" />
                </header>

                <ul>
                    <li class="bookSection">Author: <span class="bookValue" data-bind="text: author"></span></li>
                    <li class="bookSection">Genre: <span class="bookValue" data-bind="text: genre"></span></li>
                    <li class="bookSection">Rating: <span class="bookValue" data-bind="text: rating"></span></li>
                    <li class="bookSection">Description:</li>
                    <li class="bookValue" data-bind="text: description"></li>
                </ul>

                <p class="error" data-bind="visible: errorMessage, text: errorMessage"></p>


                <a href="#" data-bind="click: $parent.deleteBook" alt="Remove from list">Remove</a>
                <span data-binding="visible: canEdit"> | </span>
                <a href="#" data-bind="click: $parent.editBook" alt="Edit the book">Edit</a>
            </article>
        </section>

        <section id="book" data-bind="with: book">
            <article class="todoList">
                <header>
                    <h3 data-bind="value: title" />
                </header>

                <ul>
                    <li class="bookSection">Author: <input type="text" class="bookValue" data-bind="value: author, blurOnEnter: true" /></li>
                    <li class="bookSection">Genre: <input type="text" class="bookValue" data-bind="value: genre" /></li>
                    <li class="bookSection">Rating: <input type="text" class="bookValue" data-bind="value: rating" /></li>
                    <li class="bookSection">Description:</li>
                    <li><input type="text" class="bookValue" data-bind="value: description" /></li>
                </ul>
                
                <a href="#" data-bind="click: $parent.doneEdit" alt="Return to List">Return To List</a>
            </article>
        </section>
    }
    else
    {
        <div class="todoList" id="loginPanel">
            <section id="localLoginPanel">
                <h2>Log in</h2>
                @Html.Partial("_Login")
            </section>
            <p>First time here? <a id="showRegister">Sign up</a></p>
        </div>
        <div class="todoList" id="registerPanel">
            <h2>Sign up</h2>
            @Html.Partial("_Register")
            <p>Already signed up? <a id="showLogin">Log in</a></p>
        </div>
    }
</div>

@if (@User.Identity.IsAuthenticated)
{
    @section scripts {
        @Scripts.Render("~/bundles/knockout")
        @Scripts.Render("~/bundles/jqueryval")
        @Scripts.Render("~/bundles/netbooks")
    }
}